<template>
  <div id="app">
    <!-- <router-link :to="{name:'demo'}"></router-link>  -->
    <transition enter-active-class="animated fadeInRightBig" >
  		<router-view class="routerview"></router-view>
		</transition>
    <tabbar style="position: fixed;">
      <tabbar-item selected link="/publishingTask">
        <img slot="icon" src="./assets/tabbar/jd.png">
        <span slot="label">发布任务</span>
      </tabbar-item>
      <tabbar-item link="/discountShow">
        <img slot="icon" src="./assets/tabbar/tmall.png">
        <span slot="label">折扣爆料</span>
      </tabbar-item>
      <tabbar-item link="personalCenter">
        <img slot="icon" src="./assets/tabbar/us.png">
        <span slot="label">个人中心</span>
      </tabbar-item>
    </tabbar>
  </div>
</template>

<script>
  import {Tabbar, TabbarItem} from 'vux'
	
  export default {
    name: 'app',
    components: {
      Tabbar,
      TabbarItem
    },
    data:function(){
    	return {
    	}
    }
  }
</script>
<style lang="css">
	@import 'styles/animate.css'
</style>

<style lang="less">
  @import '~vux/src/styles/reset.less';
	@import 'styles/base.less';
	
 
  body {
    background-color: #fbf9fe;
    overflow-x: hidden;
  }
  
  .routerview{
     margin-bottom: 6rem;
  }
  
  /**tabber css重置**/
  .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon, .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon > i, .weui-tabbar__item.weui-bar__item_on .weui-tabbar__label{
  	color:#d5291f !important;
  }
  
  .weui-tabbar__label{
  	font-size:1.2rem !important;
  }
 	.weui-tabbar__icon{
 		width:2.7rem !important;
 		height:2.7rem !important;
 	}
</style>
